<template>
  <el-radio-group v-model="isCollapse" style="margin-bottom: 20px">
    <el-radio-button :label="false">展开</el-radio-button>
    <el-radio-button :label="true">折叠</el-radio-button>
  </el-radio-group>
  <el-menu :collapse="isCollapse">
    <SubMenu
      :fileMenu="fileMenu"
      @selectHandleItem="selectHandleItem"
    ></SubMenu>
  </el-menu>
</template>

<script lang="ts" setup>
import type { PropType } from 'vue'
import SubMenu from './SubMenu.vue'
import type { FileMenu } from './types'

defineProps({
  fileMenu: {
    type: Array as PropType<FileMenu>,
    default: () => []
  }
})
const emit = defineEmits(['selectHandleItem'])
const isCollapse = ref(false)
// const handleOpen = (key: string, keyPath: string[]) => {
//   console.log(key, keyPath)
// }
// const handleClose = (key: string, keyPath: string[]) => {
//   console.log(key, keyPath)
// }
const selectHandleItem = (item: any) => {
  emit('selectHandleItem', item)
}
</script>

<style lang="less" scoped></style>
